<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2021/11/24
  Time: 10:42
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录页面</title>
    <script src="/js/jquery.js"></script>
    <style>
        div {
            width: 400px;
            margin: 1em auto;
            padding: 10px;
            background: darkgray;
            text-align: center;
        }
    </style>

    <script type="text/javascript">
        // 页面加载完成之后
        $(function () {
            // 给验证码的图片绑定单击事件
            $("#code_img").click(function () {
                // 在事件响应的 function 函数中有一个 this 对象。这个 this 对象，是当前正在响应事件的 dom 对象
                // src 属性表示验证码 img 标签的图片路径。它可读，可写
                // alert(this.src);
                this.src = "/kaptcha.jpg" + new Date();
            });
        })
    </script>
</head>
<body>
    <div>
    <h3>登录页面</h3>

        <form action="/phone/login" method="post">
            <a href="/phone/regist">没有用户？立即注册</a>
            <br><br>
            <label>
                <span>用户名：</span>
                <input name="username" placeholder="请输入用户名">
            </label><br><br>
            <label>
                <span>密码：</span>
                <input name="password" placeholder="请输入密码" type="password">
            </label><br><br>
            <label>
                <span>验证码</span>
                <input type="text" name="code" style="width: 80px">
                <img src="code_img" srcset="/kaptcha.jpg" style="width: 80px; height: 28px">
            </label><br><br>
            <button>登录</button>
        </form>
    </div>
</body>
</html>
